*, ul { margin: 0; padding: 0; box-sizing: border-box; color: inherit; font-size: inherit; font-family: inherit; } table { border-spacing: 0; border-collapse: collapse; border: none; } table, td { vertical-align: top; } html { background: #f9f9f9; } body { min-height: 100%; padding: 0 20px 40px 20px; font: 12px Arial, Helvetica, sans-serif; line-height: 1.5; color: #000000; background: #e7f0f5; background: linear-gradient(to bottom, #e7f0f5 1%,#f9f9f9 100%); } .cms_container { width: 100%; margin: 0 auto; background-color: #ffffff;} body.cms .cms_container { max-width: 1240px; } body > .cms_container { padding-top: 146px; box-shadow: 0 0 5px #969696; } body.shop > .cms_container { padding-top: 182px; } .cms #content > p { padding: 0 0 12px 0; } .cms #content > ul, .cms #content > ol { padding: 0 0 12px 18px; } .img_cms { width: 100%; } .img_cms img { width: 100%; } .flex_box.flex_box_text img { width: auto; } /********| HEADER |*********************************************************************************************************************/ header { position: absolute; left: 20px; top: 0; right: 20px; z-index: 10000; } body.header_scrolled header { position: fixed; top: -50px; } header .cms_container { position: relative; height: 100px; } body.navi_scrolled header .cms_container { height: 104px; border-bottom: 4px solid #0076ad; } header #hLogo { display: block; position: absolute; left: 0; top: 0; width: 25%; height: 100px; transition: all 0.3s; } header #hLogo:after { display: block; content: ""; position: absolute; left: 30px; top: 10px; right: 30px; bottom: 10px; background: url('/www_pfefferle/pages/img/pfefferle.svg') no-repeat left center; background-size: contain; } body.header_scrolled header #hLogo { top: 50px; height: 50px; } header #hSearch { position: absolute; right: 0; top: 0px; width: 75%; height: 50px; } header #hSearch > div { position: absolute; left: 30px; top: 15px; right: 30px; bottom: 5px; height: 30px; } header #hSearch > div > form > div:nth-of-type(1) { position: absolute; left: 0; top: 0; right: 30px; bottom: 0; height: 30px; } header #hSearch > div > form > div:nth-of-type(1) input { width: 100%; height: 30px; border-style: solid; border-width: 1px 0 1px 1px; padding: 0 15px; line-height: 28px; background: #ffffff; border-radius: 0; box-shadow: none;-webkit-appearance:none; border-color: #dddddd; } header #hSearch > div > form > div:nth-of-type(2) { position: absolute; top: 0; right: 0; bottom: 0; height: 30px; width: 30px; } header #hSearch > div > form > div:nth-of-type(2) button { position: relative; width: 100%; height: 30px; border-style: solid; border-width: 1px 1px 1px 0; padding: 0; line-height: 28px; background: none; cursor: pointer; border-radius: 0; -webkit-appearance:none; border-color: #dddddd; } header #hSearch > div > form > div:nth-of-type(2) button:after { display: block; content: "\f002"; left: 0; top: 4px; right: 4px; bottom: 4px; width: 25px; height: 22px; text-align: center; line-height: 22px; font-family: "FontAwesome"; } header #hSearch.busy > div > form > div:nth-of-type(2) button:after { content: ""; background: url("/pages2015/img/spinner.svg") no-repeat center; background-size: contain; } header #hService { position: absolute; right: 0; top: 50px; width: 75%; height: 50px; } header #hService > ul { position: absolute; left: 30px; top: 10px; right: 30px; bottom: 10px; height: 30px; margin: 0; padding: 0; } header #hService > ul:after { display: block; content: ""; clear: both; } header #hService > ul > li { float: right; list-style: none; padding-left: 5px; } header #hService > ul > li > ul { margin: 0; padding: 0 0 0 20px; } header #hService > ul > li > ul:after { display: block; content: ""; clear: both; } header #hService > ul > li > ul > li { float: left; list-style: none; } header #hService > ul > li > ul > li > a, header #hService > ul > li > ul > li > div { position: relative; display: block; width: 30px; height: 30px; line-height: 30px; text-align: right; font-size: 16px; cursor: pointer; color: #000000; } header #hService > ul > li > ul > li > a:hover, header #hService > ul > li > ul > li > div:hover { color: #e04444 } header #hService > ul > li > ul > li > a span { display: none; position: absolute; left: -2px; bottom: -6px; width: 20px; height: 20px; background: rgba(228,5,22,1); border-radius: 50%; color: rgba(255,255,255,1); text-align: center; line-height: 20px; font-size: 11px; } header #hService > ul > li > ul > li > a.full span { display: block; } header #hService > ul > li#hToggler { width: 0; overflow: hidden; } body.header_scrolled header #hService > ul > li#hToggler { width: 55px; } body.navi_scrolled header #hService > ul > li#hToggler { width: 105px; } header #hService > ul > li > ul > li#hHamburgerT { width: 0; overflow: hidden; } body.navi_scrolled header #hService > ul > li > ul > li#hHamburgerT { width: 50px; } /********| END HEADER |*********************************************************************************************************************/ /********| NAVIGATION |*********************************************************************************************************************/ nav#navigation { position: absolute; left: 20px; top: 100px; right: 20px; z-index: 1000; } nav#navigation .cms_container { position: relative; background: #0076ad; } #navi:after { display: block; content: ""; clear: both; } #navi > li { list-style: none; } #navi > li.navi { float: left; position: relative; } #navi > li.navi > a { display: block; padding: 10px 25px; line-height: 26px; text-decoration: none; color: #ffffff; font-size: 20px; letter-spacing: 1px; } #navi > li.navi.current > a, #navi > li.navi:hover > a { background: #e04444; } #navi > li.navi > ul.cms { display: none; position: absolute; left: 0; top: 46px; padding: 24px 0; min-width: 100%; background: #ffffff; box-shadow: 0 2px 5px #969696; } #navi > li.navi:hover > ul.drop { display: block; } #navi > li.navi > ul.cms > li { list-style: none; } #navi > li.navi > ul.cms > li > a { display: block; padding: 3px 25px; font-size: 15px; white-space: nowrap; } #navi > li.navi > ul.cms > li.current > a, #navi > li.navi > ul.cms > li:hover > a { color: #e04444; } #shopnavi { display: none; padding: 0 15px; background: #a5a5a5; } body.navi_scrolled #shopnavi { display: none; } #shopnavi:after { display: block; content: ""; clear: both; } #shopnavi li { float: left; list-style: none; margin-right: 10px; } #shopnavi li.current { border-color: #0076ad #a5a5a5 #ffffff #a5a5a5; border-width: 5px 10px 31px 10px; border-style: solid; } #shopnavi li a { display: block; padding: 0 10px; border-width: 5px; border-style: solid; border-color: #a5a5a5; font-size: 18px; font-weight: 300; text-transform: uppercase; color: #ffffff; line-height: 26px; } #shopnavi li a:hover { color: #004968; } #shopnavi li.current a { margin: -5px 0 -31px 0; background: none; border-color: transparent; color: #0076ad; } #navi > li#nLanguage { float: right; padding: 16px 30px 16px 0; } #navi > li#nLanguage li { list-style: none; float: left; height: 14px; margin: 0 0 0 10px; padding: 0 0 0 10px; border-left: 2px solid #ffffff; line-height: 14px; } #navi > li#nLanguage li:first-of-type { margin: 0; padding: 0; border-left: none; } #navi > li#nLanguage li a { color: #ffffff; font-weight: bold; } #navi > li#nTools { float: right; padding: 10px 20px 10px 0; } #navi > li#nTools ul:after { display: block; content: ""; clear: both; } #navi > li#nTools li { position: relative; list-style: none; float: left; height: 26px; padding: 0 0 0 20px; line-height: 26px; } #navi > li#nTools li a { color: #ffffff; font-size: 15px; } #navi > li#nTools li ul { display: none; position: absolute; top: 26px; right: -10px; padding: 30px 0 20px 0; } #navi > li#nTools li:hover ul { display: block; } #navi > li#nTools li ul:before { display: block; content: ""; position: absolute; left: 0; top: 10px; right: 0; bottom: 0; box-shadow: 0 2px 5px #969696; background: #ffffff; } #navi > li#nTools li ul li { position: relative; z-index: 1; float: none; padding: 0; } #navi > li#nTools li ul li a { display: block; padding: 0 25px; white-space: nowrap; color: #969696; cursor: pointer; } #navi > li#nTools li ul li a:hover { color: #e04444; } body.navi nav#navigation { position: fixed; top: 54px; } body.navi #navi { position: absolute; right: 0; top: 0; padding: 0 0 15px 0; background: #0076ad; box-shadow: 0 2px 5px #969696; } body.navi #navi > li#nTools { float: none; margin-bottom: 30px; } body.navi #navi > li#nLanguage { padding: 16px 20px 16px 0; } body.navi #navi > li.navi { float: none; } body.navi #navi > li.navi > ul { display: none !important; position: static; left: 0; top: 0; box-shadow: none; } body.navi #navi > li.navi.current > ul, body.navi #navi > li.navi.open > ul { display: block !important; } body.navi #navi > li.navi > a { padding: 10px 70px 10px 25px; } body.navi #navi > li.navi > .togglenavi { position: absolute; right: 0; top: 0; width: 46px; height: 46px; cursor: pointer; } body.navi #navi > li.navi > .togglenavi:after { display: block; content: "\f067"; position: absolute; left: 10px; top: 10px; width: 26px; height: 26px; line-height: 26px; text-align: center; color: #ffffff; font-size: 16px; font-family: "FontAwesome"; } body.navi #navi > li.navi.open > .togglenavi:after { content: "\f068"; } body.navi #navi > li.navi.current > .togglenavi:after { content: ""; } @media screen and (min-width: 1280px) { body.shop #shopnavi { display: block; } } @media screen and (min-width: 641px) and (max-width: 1279px) { body > .cms_container { padding-top: 100px !important; } header .cms_container { height: 104px; border-bottom: 4px solid #0076ad; } header #hService > ul > li#hToggler { width: 55px !important; } body.header_scrolled header #hService > ul > li#hToggler { width: 105px !important; } header #hService > ul > li#hToggler > ul > li#hSearchT { width: 0px; overflow: hidden; } body.header_scrolled header #hService > ul > li#hToggler > ul > li#hSearchT { width: 50px; } header #hService > ul > li#hToggler > ul > li#hHamburgerT{ width: 30px !important; } body.navi { overflow: hidden; } body #navigation { display: none; } body.navi #navigation { display: block; top: 104px !important; bottom: 0; overflow-x: hidden; overflow-y: auto; } body.navi.header_scrolled #navigation { top: 54px !important; } } /********| END NAVIGATION |*********************************************************************************************************************/ /********| END HEADER |*********************************************************************************************************************/ /********| CRUMP |*********************************************************************************************************************/ #crump { position: relative; z-index: 1; height: 45px; font-size: 12px; } #crump > div { display: none; position: absolute; left: 0; top: 15px; z-index: 10; width: 30px; height: 30px; line-height: 30px; text-align: center; color: #ffffff; background: #a5a5a5; cursor: pointer; } #crump > div:after { display: block; content: ""; position: absolute; left: 30px; top: 0; z-index: 1; border-style: solid; border-width: 15px 0 15px 5px; border-color: transparent transparent transparent #a5a5a5; } #crump > div:hover { background: #0076ad; } #crump > div:hover:after { border-color: transparent transparent transparent #0076ad; } #crump > ul#path { position: absolute; left: 0; top: 15px; right: 30px; height: 30px; } #crump > ul#path.pn { right: 70px; } #crump > ul#path > li { position: relative; float: left; list-style: none; padding-right: 20px; color: #a5a5a5; line-height: 30px; } #crump > ul#path > li:after { display: block; content: "\f054"; position: absolute; right: 0; top: 0; width: 20px; height: 30px; line-height: 30px; text-align: center; font-family: "FontAwesome"; font-size: 10px; } #crump > ul#path > li:last-of-type:after { display: none; } #crump > ul#path > li:first-of-type:after { display: none; } #crump > ul#path > li > a { display: block; } #crump > ul#path > li > a:hover { color: #0076ad; } #crump > ul#path > li:first-of-type a { position: relative; display: block; width: 30px; height: 30px; font-size: 16px; text-align: center; color: #ffffff; background: #a5a5a5; line-height: 30px; cursor: pointer; } #crump > ul#path > li:first-of-type a:hover { background: #0076ad; } #crump > ul#path > li:first-of-type a:after { display: block; content: ""; position: absolute; left: 30px; top: 0; z-index: 1; border-style: solid; border-width: 15px 0 15px 5px; border-color: transparent transparent transparent #a5a5a5; } #crump > ul#path > li:first-of-type a:hover:after { border-color: transparent transparent transparent #0076ad; } #crump > ul#prevnext { display: flex; flex-wrap: wrap; justify-content: space-between; position: absolute; right: 0; top: 15px; width: 65px; height: 30px; } #crump > ul#prevnext > li { list-style: none; } #crump > ul#prevnext > li > a { position: relative; display: block; width: 30px; height: 30px; font-size: 16px; text-align: center; color: #ffffff; background: #a5a5a5; line-height: 30px; cursor: pointer; } #crump > ul#prevnext > li > a:hover { background: #0076ad; } @media screen and (max-width: 1279px) { body.shop #crump > div { display: block; } body.shop #crump ul#path { left: 50px; } body.shop #crump > ul#path > li { display: none; } body.shop #crump > ul#path > li:nth-last-of-type(2), body.shop #crump > ul#path > li:nth-last-of-type(1) { display: block; } body.shop #crump.show > div { background: #0076ad; } body.shop #crump.show > div:after { left: 0; top: 30px; border-width: 5px 15px 0 15px; border-color: #0076ad transparent transparent transparent; } body.shop #crump.show > ul#path { left: 0; top: 45px; right: auto; height: auto; padding: 15px 0; background: #ffffff; box-shadow: 0 2px 5px #969696; } body.shop #crump.show > ul#path > li { display: block; float: none; } body.shop #crump.show > ul#path > li:after { display: none; } body.shop #crump.show > ul#path > li:first-of-type { display: none; } body.shop #crump.show > ul#path > li:last-of-type { padding: 0 20px } body.shop #crump.show > ul#path > li > a { padding: 0 20px; } } /********| END CRUMP |*********************************************************************************************************************/ /********| HOME |*********************************************************************************************************************/ .home_shop a { display: block; height: 100%; background: #0076ad; color: #ffffff; } .home_shop table { width: 100%; height: 100%; } .home_shop table tr:nth-of-type(1) td { padding: 50px 0 10px 0; line-height: 30px; text-align: center; font-weight: bold; font-size: 36px; text-transform: uppercase; } .home_shop table tr:nth-of-type(2) { height: 100%; } .home_shop table tr:nth-of-type(2) td { height: 100%; } .home_shop table tr:nth-of-type(2) td div { position: relative; height: 100%; } .home_shop table tr:nth-of-type(2) td div:after { display: block; content: ""; position: absolute; left: 20px; top: 40px; right: 20px; bottom: 40px; background: url("/www_pfefferle/pages/img/webshop2.jpg") no-repeat center; background-size: contain; } .home_shop table tr:nth-of-type(3) td { padding: 20px 10px; line-height: 30px; text-align: center; font-size: 22px; background: #004c70; } @media screen and (max-width: 1024px) { .home_shop table tr:nth-of-type(2) td div:after { top: 20px; bottom: 20px; } } .slider_static { position: relative; padding: 25%; background-repeat: no-repeat; background-position: center; background-size: cover; } .slider_static > div { position: absolute; left: 0; bottom: 0; right: 0; padding: 15px 20px; background: #0076ad; color: #fff; } .slider_static > div * { color: #fff !important; margin: 0; } .home_top_showall { float: right; color: #777777; font-weight: bold; line-height: 36px; cursor: pointer; } .home_top_showall:hover { color: #0076ad; } .flex_equalizer_1 { overflow: hidden; } .flex_equalizer_2 { margin: -4px 0 0 -4px; } .top_box { border-left: 4px solid #efefef; border-top: 4px solid #efefef; cursor: pointer; } .top_box > div { height: 100%; background: #0076ad; } .top_box:hover > div { background: rgba(228,5,22,1); } .top_image { padding: 50%; background-repeat: no-repeat; background-position: center; background-size: contain; background-color: #ffffff; } .top_text { padding: 15px; color: #ffffff; line-height: 20px; font-weight: bold; font-size: 14px; } @media screen and (max-width: 959px) { #home .flex_box { width: 100% !important; } .home_shop table, .home_shop table tbody tr, .home_shop table tbody tr td { display: block; } .home_shop table tbody { display: flex; flex-wrap: wrap; justify-content: flex-start; width: 100%; } .home_shop table tr:nth-of-type(1) { order: 2; } .home_shop table tr:nth-of-type(1) td { padding: 35px 20px 0 10px; text-align: left; } .home_shop table tr:nth-of-type(2) { order: 1; } .home_shop table tr:nth-of-type(2) td div { width: 100px; height: 100px; } .home_shop table tr:nth-of-type(2) td div:after { left: 10px; top: 10px; right: 10px; bottom: 10px } .home_shop table tr:nth-of-type(3) { display: none; } } @media screen and (min-width: 769px) and (max-width: 959px) { #home .flex_box.top_box { width: 33.3333% !important; } } @media screen and (min-width: 641px) and (max-width: 768px) { #home .flex_box.top_box { width: 50% !important; } } /********| END HOME |*********************************************************************************************************************/ /********| MAIN |*********************************************************************************************************************/ h1 { font-size: 24px; font-weight: bold; line-height: 36px; color: #0076ad; } h3 { font-size: 18px; font-weight: bold; line-height: 28px; color: #777777; } .cms #content ul { padding-left: 20px; } #content { padding: 30px; } body.shop #content { padding: 10px; } body.shop #content_product_det { padding: 10px; } body.shop #box_ohne_navigation { padding: 10px; } #content #productContainer { margin: 0 -30px; } #content #productBox { display: flex; flex-wrap: wrap; justify-content: flex-start; width: 100%; margin: 0; padding: 15px; } #content #productBox > a { width: 25%; height: auto; margin: 0; padding: 15px; } #content #productBox > a > div.productLinkTitle { display: block; width: 100%; height: 38px; background: #0076ad; overflow: hidden; } #content #productBox > a > div.productLinkTitle > span { display: table; width: 100%; height: 38px; padding: 0; } #content #productBox > a > div.productLinkTitle > span > span { display: table-row; } #content #productBox > a > div.productLinkTitle > span > span > span { display: table-cell; width: 100%; height: 38px; padding: 3px 12px; line-height: 16px; vertical-align: middle; text-align: center; font-weight: bold; color: #fff; } #content #productBox > a > div.productLinkImage { width: 100%; overflow: hidden; } #content #productBox > a > div.productLinkText { width: 100%; } #content #productBox > a:hover > div.productLinkTitle { background: #e04444; } @media screen and (min-width: 769px) and (max-width: 959px) { #content #productBox > a { width: 33.33333% } } @media screen and (min-width: 641px) and (max-width: 768px) { #content #productBox > a { width: 50% } } @media screen and (max-width: 640px) { #content #productBox > a { width: 100% } } /********| END MAIN |*********************************************************************************************************************/ /********| SHOP |*********************************************************************************************************************/ .ahdMText_title span:nth-of-type(1) { font-weight: 16px; font-weight: normal; color: #777777; } /********| END SHOP |*********************************************************************************************************************/ /********| FOOTER |*********************************************************************************************************************/ footer { background: #f0f0f0; color: #a5a5a5; } footer h2 { color: #646464; } footer a { color: #a5a5a5; text-decoration: none; } footer a:hover { color: #000000; } footer li { list-style: none; text-align: right; } footer #fCertificates { padding: 0; margin: 0; } footer #fCertificates:after { display: block; content: ""; clear: both; } footer #fCertificates li { float: left; padding-right: 20px; line-height: 1px; } footer #fCertificates li img { width: auto; height: 40px; } footer #fCopy { padding-top: 35px; line-height: 20px;} /********| END FOOTER |*********************************************************************************************************************/ /********| FLEXBOX |*********************************************************************************************************************/ .flex_container { display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; padding: 15px; } .flex_container.left { justify-content: flex-start; } .flex_container.center { justify-content: center ; } .flex_container.right { justify-content: flex-end; } .flex_container.top { align-items: flex-start; } .flex_container.middle { align-items: center ; } .flex_container.bottom { align-items: flex-end; } .flex_container.stretch { align-items: stretch; } .flex_container.no_padding { padding: 0; } .flex_box { margin: 0; padding: 15px; } .flex_box.no_padding { padding: 0; } .flex_box.grow { flex-grow: 1; } .flex_box.empty { margin: 0 !important; padding: 0 !important; border: none !important; background: 0 !important; } .flex_box img { width: 100%; } .flex_box_25 { width: 25.000% } .flex_box_50 { width: 50.000% } .flex_box_75 { width: 75.000% } .flex_box_100 { width: 100.000% } .flex_box_20 { width: 20% } .flex_box_40 { width: 40% } .flex_box_60 { width: 60% } .flex_box_80 { width: 80% } .flex_box_16 { width: 16.666% } .flex_box_33 { width: 33.333% } .flex_box_66 { width: 66.666% } .flex_box_83 { width: 83.333% } @media screen and (min-width: 641px) and (max-width: 959px) { .flex_box_25 { width: 50% } .flex_box_75 { width: 100% } .flex_box_20 { width: 50% } .flex_box_40 { width: 50% } .flex_box_50 { width: 100% } .flex_box_60 { width: 100% } .flex_box_16 { width: 33.333% } .flex_box_83 { width: 100% } } .w100p { width: 100%; } .h100p { height: 100%; } .blockUI { z-index: 1000000 !important; } /********| END FLEXBOX |*********************************************************************************************************************/ /* ############################################ Gerüst ############################################ */ #content.cms { width: 740px; padding: 0 !important; } #content.shop { box-sizing: border-box; padding: 15px 40px 15px 15px !important; } #content.shop * { box-sizing: border-box; border-collapse: collapse; } /*body a { color: #0076ad; } body a:hover { color: #004C70; }*/ h1 { color: #0076ad !important; } .w150 { width: 150px; } .imgCol img { padding-bottom: 20px; } /* For the cms */ .grp { clear: both; } .img_cms.L { margin: 0 20px 10px 0; padding-top: 3px; } .img_cms.LT { margin: 0 20px 10px 0; } .img_cms.R { margin: 0 0 10px 20px; padding-top: 3px; } .img_cms.RT { margin: 0 0 10px 20px; } /* #################################################################################################################################### Header #################################################################################################################################### */ body div#header { background: none; position: relative; } body div#header_box { position: relative; height: 100px; } body div#header_image { display: block; float: left; height: 100px; width: 211px; margin-left: 20px; background: url('/www_pfefferle/pages/img/Logo_epure.jpg') no-repeat center; background-size: contain; } body div#certified_box { position: absolute; right: 20px; top: 10px; } body div#certified_box img { margin-left: 10px; } #search_container, #search_container * { box-sizing: border-box; } #search_container { position: absolute; right: 15px; bottom: 48px; width: 610px; border-width: 5px; border-style: solid; border-color: #ffffff #ffffff #ffffff #ffffff; } #search_container > div { position: relative; height: 36px; } #search_container input[type="text"]{ width: 100%; height: 36px; padding: 4px 40px 4px 14px; border-width: 1px 1px 1px 1px; border-style: solid; border-color: #e5e5e5; line-height: 26px; } #search_container input[type="submit"]{ position: absolute; right: 1px; top: 1px; width: 35px; height: 35px; border: none; background: url("/www_pfefferle/pages/img/search_black.svg") no-repeat center #e5e5e5; background-size: 50% auto; border-radius: 0; box-shadow: none; } #search_container input[type="submit"]:hover { background: url("/www_pfefferle/pages/img/search_dc291a.svg") no-repeat center #e5e5e5; background-size: 50% auto; cursor: pointer; } #search_container.busy input[type="submit"] { background: url("/www_pfefferle/pages/img/loader.gif") no-repeat center #e5e5e5; background-size: auto; cursor: pointer; } header #search_container div { position: relative; } .ui-autocomplete.searchResult { z-index: 1000 !important; width: 100% !important; max-height: 85vH; overflow-y: auto; padding: 0; background: none; border: none !important; box-shadow: 0 5px 10px rgba( 0,0,0,0.2 ); } .ui-autocomplete.searchResult li { margin: 0 !important; padding: 0 !important; list-style: none; border: 0 !important; background: #e5e5e5); } .ui-autocomplete.searchResult li a { display: block; margin: 0; padding: 5px; background: #e5e5e5; color: #000000; border: 0 !important; } .ui-autocomplete.searchResult li a .sThumb { line-height: 1px; } .ui-autocomplete.searchResult li a .sThumb div { margin: 0 10px 0 0; padding: 4px; background: rgba(255,255,255,1); } .ui-autocomplete.searchResult li a .sThumb div div { width: 44px; height: 44px; margin: 0; padding: 0; background-repeat: no-repeat; background-position: center; background-size: contain; } .ui-autocomplete.searchResult li a .sText { padding: 0; vertical-align: middle; line-height: 18px; font-weight: bold; font-size: 12px;} .ui-autocomplete.searchResult li.ui-state-focus a, .ui-autocomplete.searchResult li:hover a { background: #99ddff; } /*#searchBox { width: 200px; padding: 7px 0 0 15px; } #id_searchBox { float: left; width: 153px; height: 14px; padding: 5px 5px 0px 5px; border: 1px solid #f2f3f4; font-size: 11px; }*/ #headerNavigation { padding: 0px 200px 0px 0px; margin: 0; background: #0076ad; } #headerNavigation:after { display: block; content: ""; clear: both; } #headerNavigation li { list-style: none; float: left; } #headerNavigation li a { display: block; line-height: 26px; text-decoration: none; padding: 10px 25px; color: #ffffff; font-size: 20px; letter-spacing: 1px; } /*#headerNavigation li a:hover { background: #99DDFF; }*/ #headerNavigation li.current a, #headerNavigation li a:hover { background: #e04444; } /*#headerNavigation li:hover, #headerNavigation li.current { border-color: #e04444 #0076ad #0076ad #0076ad; border-width: 40px 12px 6px 12px; border-style: solid; } #headerNavigation li:hover a, #headerNavigation li.current a { margin: -40px 0 -6px 0; background: transparent; padding: 10px 13px; }*/ /*#headerNavigation li { position: relative; } #headerNavigation li:after { display: none; position: absolute; left: 0; bottom: 7px; height: 5px; width: 100%; background: #e04444; content: ""; } #headerNavigation li:hover:after, #headerNavigation li.current:after { display: block; }*/ #language_navi { position: absolute; right: 0; top: 112px; margin: 0; padding: 0 20px; } #language_navi li { list-style: none; float: left; } #language_navi li a { border-left: 2px solid #ffffff; margin-left: 8px; padding-left: 8px; color: #ffffff; font-weight: bold; line-height: 25px; } #language_navi li:first-child a { border-left: none; margin-left: 0; padding-left: 0; } #tool_navi { position: absolute; right: 70px; bottom: -38px; padding: 0 20px; margin: 0; } #tool_navi li { list-style: none; float: left; position: relative;; } #tool_navi li a { display: block; margin-left: 4px; width: 28px; height: 28px; border-radius: 5px; background-repeat: no-repeat; background-position: center; } #tool_navi li#disk_menu a { background-image: url(/www_pfefferle/pages/img/save_white_2.png); border-radius: 5px 5px 0 0; } #tool_navi li#tool_mail a { background-image: url(/www_pfefferle/pages/img/mail_white_2.png); } #tool_navi li#tool_print a { background-image: url(/www_pfefferle/pages/img/print_white_2.png); } #tool_navi li:hover a { background-color: #f1f1f1; } #tool_navi li#disk_menu:hover a { background-image: url(/www_pfefferle/pages/img/save.png); } #tool_navi li#tool_mail:hover a { background-image: url(/www_pfefferle/pages/img/mail.png); } #tool_navi li#tool_print:hover a { background-image: url(/www_pfefferle/pages/img/print.png); } #tool_navi ul { display: none; position: absolute; right: 0px; top: 20px; padding-top: 4px; margin: 0; z-index: 10000; } #tool_navi li:hover > ul { display: block; } #tool_navi ul li { float: none; display: block; } #tool_navi ul li a { height: auto; width: auto; padding: 1px 3px; border-radius: 0 !important; color: #343434; text-decoration: none; white-space: nowrap; background: #f1f1f1 !important; cursor: pointer; } #tool_navi ul li:first-child a { padding-top: 5px; border-radius: 5px 0 0 0 !important; } #tool_navi ul li:last-child a { padding-bottom: 5px; border-radius: 0 0 5px 5px !important; } #tool_navi ul li a:hover { color: #0076ad; } /* #################################################################################################################################### Basket #################################################################################################################################### */ #my_basket { position: fixed; right: 0; top: 187px; z-index: 100001; } #my_basket_toggler { position: relative; width: 40px; height: 50px; border-radius: 15px 0 0 15px; cursor: pointer; background: url('/www_pfefferle/pages/img/cart_white_24.png') no-repeat center #004C70; } #basket_counter { position: absolute; left: 8px; top: -12px; background: #99DDFF; width: 24px; height: 24px; border-radius: 12px; line-height: 24px; text-align: center; font-weight: bold; border: none; } #basket_counter.full { background: #bF0004; color: #ffffff; } #my_basket_warenkorb { display: none; } #warenkorb { width: 100px; height: 30px; padding: 10px; line-height: 15px; background: #0076ad; color: #ffffff; cursor: pointer; } /* #################################################################################################################################### Home #################################################################################################################################### */ #homeBox { padding: 15px 0 0 20px; } #eyeCatcherBox { margin-right: -20px; padding-bottom: 55px; } .eyeCatcher { display: block; float: left; width: 233px; height: 338px; margin: 0 21px 0 0 !important; } .eyeCatcher.eyeCatcherShop { background-image: url('/www_pfefferle/pages/img/home_shop_v2.png'); } .eyeCatcher.eyeCatcherShop.eyeCatcherShop2 { background-image: url('/www_pfefferle/pages/img/home_shop_v2_fr.png'); } /*.eyeCatcher.eyeCatcherHot li { list-style: none; padding-bottom: 13px; } .eyeCatcher.eyeCatcherHot li.last { padding-bottom: 0; } .eyeCatcher.eyeCatcherHot li a { display: block; padding-left: 18px; font-size: 20px; color: #3d3d3d; line-height: 58px; height: 58px; text-transform: uppercase; text-decoration: none; cursor: pointer; font-weight: bold; background: url('/www_pfefferle/pages/img/peterhans_homeArrow.png') no-repeat 200px center #f1f1f1; } .eyeCatcher.eyeCatcherHot li a.current { background-color: #e1e1e1; }*/ .eyeCatcher.eyeCatcherPdf { height: 338px; background-repeat: no-repeat; background-position: center; background-size: cover; cursor: pointer; } /*.eyeCatcher .eyeCatcherPdfFrame { display: block; background: url('/www_pfefferle/pages/img/peterhans_pdfFrame3.png') no-repeat; width: 225px; height: 205px; }*/ #homeAjaxAction { min-height: 252px; margin-right: 25px; background: url('/www_pfefferle/pages/img/loading_40x40_white.gif') no-repeat center; } #homeAjaxAction_inner { background: #ffffff; min-height: 225px; width: 720px; overflow: hidden; } #homeAjaxAction_overflow { margin-right: -50px; max-height: 285px; overflow: hidden; } .homeAjaxAction_title { color: #777777; text-transform: uppercase; font-size: 20px; font-weight: bold; padding-bottom: 15px; width: 720px; } #homeAjaxAction .hit_preis { padding-left: 0; } .homeAjaxAction_title_show_all { float: right; display: inline-block; font-weight: bold; font-size: 12px; padding: 0 0 0 39px; background: url(/pages/img/news_show_all_777777.png) no-repeat 21px center; } .homeAjaxAction_title_show_all:hover{ background: url(/pages/img/news_show_all_0076ad.png) no-repeat 21px center; color: #0076ad; cursor: pointer; } .home_topangebote { float: left; width: 224px; padding: 0 14px 0 0px; margin-right: 14px; border-right: 3px solid #ededed; } .home_topangebote a { display: block; position: relative; width: 224px; height: 245px; background-repeat: no-repeat; background-position: center; background-size: contain; } .home_topangebote a div { display: block; position: absolute; left: 0; bottom: 0; width: 200px; padding: 8px 12px; overflow: hidden; background: #0076ad; color: #ffffff; font-weight: bold; } /* ############################################ Main ############################################ */ #main { background-color:#ffffff; } /* ############################################ Menu Left ############################################ */ #menu_left { float: left; width: 210px; margin-left: 5px; } #menu_left ul { margin: 15px 0 0 0px; padding: 0px; } #menu_left ul li { list-style: none; margin: 0px; padding: 0px; } #menu_left ul li a { display: block; margin: 0; padding: 3px 0px 3px 20px; text-decoration: none; background-position: 5px 6px; background-repeat: no-repeat; } /* 1. Ebene */ #menu_left ul { background: /*#313131*/ #0076ad; } #menu_left ul li a { background-image: url(/www_pfefferle/pages/img/arrow_white.gif); color: #ffffff; font-weight: bold; } #menu_left ul li a:hover { background-color: #0076ad; } #menu_left ul li a.current { background-color: #99DDFF; background-image: url(/www_pfefferle/pages/img/arrow_down_white.gif); } /* 2. Ebene */ #menu_left ul ul { background: #efefef; } #menu_left ul ul li a { color: #000000; background-image: none; word-wrap: break-word; } #menu_left ul ul li a:hover { color: #0076ad; background-image: url(/www_pfefferle/pages/img/arrow.gif); background-color: transparent; } #menu_left ul ul li a.current, #menu_left ul ul li a.active { color: #0076ad; background-image: url(/www_pfefferle/pages/img/arrow_down.gif); background-color: transparent; } /* 3.+ Ebene */ #menu_left ul ul ul { background: #ffffff; } #menu_left ul ul ul li { padding-left: 20px; } /* ############################################ Content ############################################ */ #content { background-color:#ffffff; padding-bottom: 40px; } /* ############################################ Home ############################################ */ #eyecatchers #shop { float: left; width: 250px; height: 300px; margin-right: 5px; background: url(/www_pfefferle/pages/img/eyecatcher_shop_0.jpg); } #eyecatchers #shop:hover { background: url(/www_pfefferle/pages/img/eyecatcher_shop_1.jpg); } #eyecatchers #buero { float: left; width: 250px; height: 300px; background: url(/www_pfefferle/pages/img/eyecatcher_buero_0.jpg); } #eyecatchers #buero:hover { background: url(/www_pfefferle/pages/img/eyecatcher_buero_1.jpg); } #eyecatchers #katalog { float: right; width: 270px; height: 300px; background: url(/www_pfefferle/pages/img/eyecatcher_katalog_0.jpg) repeat-x; } .campaignArticle { position: relative; float:left; width:180px; height:270px; border: 5px solid #f1f1f1; margin-top:15px; margin-right:5px; } .campaignArticle p { margin: 0px; padding: 0px; } .campaignBrandImg { float:right; padding:0px; margin:0px; height:25px; width:70px; background-repeat:no-repeat; background-position:center; } .campaignAktionImg { float:left; padding:0px; margin:0px; } .campaignWarenkorbImg { position: absolute; top: 250px; left:86px; padding:0px; margin:0px; } .campaignDetailLink { position: absolute; top: 253px; left: 3px; } .campaignArticleText { font-family: Arial; font-size: 11px; color:#333333; font-weight:bold; margin-left:3px; margin-right:3px; } .campaignArticlePrice { color: #0076ad; /* font-family: "AachenBTBold"; */ font-family: Arial, Helvetica, sans-serif; font-weight:bold; font-size: 20px; margin-left:3px; } .campaignArticleAction { color: #000000; /* font-family: "AachenBTBold"; */ font-family: Arial, Helvetica, sans-serif; font-weight:bold; font-size: 12px; line-height:21px; padding-left:3px; } #campaignArticle a { font-family: Arial; font-size: 10px; color:#333333; line-height:20px; text-decoration:none; padding-left:3px; } #campaignArticle a:hover { text-decoration:underline; } /* ############################################ Varia ############################################ */ a { text-decoration: none; } a img { border: 0; } a:active, a:focus {outline: none} #auslauf { display:none; width:0px; } .oeffnungszeiten_titel { font-family: Arial, Helvetica, sans-serif; font-weight:bold; font-size: 14px; color: black; padding-left:0px; line-height:10px; } .oeffnungszeiten { font-family: Arial, Helvetica, sans-serif; font-weight:bold; font-size: 12px; color:black; padding-left:0px; } /*Code für LiveSearch*/ #resultBox { position:absolute; top:0px; left:0px; max-height:350px; min-width:0px; border: 1px solid; visibility:hidden; overflow:auto; background-color:#FFF; padding:0px; z-index:999999; } #resultBox ul { list-style-type:none; min-width:250px; background-color:#ffffff; padding:0px; margin:0px; } #resultBox li:hover{ /* background-color:#0000ff; color:white; */ cursor:pointer; } #resultBox li a{ display:block; line-height:18px; text-decoration:none; padding:0px 4px 0px 4px; height:20px; text-wrap:none; } #resultBox li a:hover{ background-color:#0076ad; color:#ffffff; text-decoration:none; cursor:pointer; } #searchAnimation { position:absolute; top:0px; left:0px; visibility:hidden; } #resultBox .resulthover a{ background: #0076ad; border-color:#0076ad !important; color:#ffffff !important; } /* ############################################ Shop ############################################ */ .sort_box_outer { border: 5px solid #f1f1f1; } .sort_box_outer_favoriten{ border: 5px solid #019235; } .sort_box_inner_head { -moz-border-radius: 0 0 0 0; border-radius: 0px; border-top:0px; border-left:0px; border-right:0px; border-bottom: 5px solid #f1f1f1; } .sort_box_inner_head_favoriten{ background-color:#019235; border-bottom: 5px solid #019235; } a.sortiment_box_inner_titel { /* font-family: "AachenBTBold"; */ font-family: "Arial", "Helvetica", sans-serif; font-size:12px; color:#343434; } a.sortiment_box_inner_titel_favoriten{ color:#ffffff; } .katalog_box_outer { border: 5px solid #f1f1f1; } .katalog_box_inner_titel { border-top:0px; border-left:0px; border-right:0px; border-bottom: 5px solid #f1f1f1; background-color: #f1f1f1; } a.katalog_box_titel { /* font-family: "AachenBTBold"; */ font-family: "Arial", "Helvetica", sans-serif; font-size:12px; color:#343434; } #container .yui-nav li { margin-bottom: -6px; } #container .yui-nav { margin-left: 1px; } /* ############################################ Shop Login ############################################ */ .shop_login input { border: 1px solid #f1f1f1; margin-top:5px; margin-left: 10px; } .shop_login_button { float:right; height: 43px; width: 45px; margin-left:0px; margin-right:2px; border: 2px solid #b31a2e; background-color:#e3001b; color:#ffffff; text-decoration: underline; font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:18px; } #box_sitemap a{ display:block; } #box_sitemap ul li a{ padding-top:10px; } #box_sitemap ul li ul li a{ padding-left:0px; padding-top:0px; } #box_sitemap ul{ list-style: none; } .hit_text { color: #333333; font-family: Arial; font-size: 11px; font-weight: bold; margin-left: 3px; margin-right: 3px; } .hit_preis { color: #0076ad; font-family: Arial,Helvetica,sans-serif; font-size: 20px; font-weight: bold; padding-left: 3px; } .hit_aktion { color: #000000; font-family: Arial,Helvetica,sans-serif; font-size: 12px; font-weight: bold; padding-left: 3px; } /* ############################################ Schlüssel Bestellformular ############################################ */ .key_order_input { width: 196px; } .contenttable { width: 100%; } .contenttable td { padding: 1px 10px 1px 0; vertical-align: top; } .contenttable td p { padding: 0; margin: 0; } .contenttable td:last-child { padding: 1px 0; } .contenttable td h2 { padding: 2px 5px; background: #f2f3f4; } .contenttable2 { width: 100%; } .contenttable2 td { padding: 0 10px 0 0; vertical-align: top; } .contenttable2 td p { padding: 0; margin: 0; } .contenttable2 td:last-child { padding: 00; } .contenttable2 td h2 { padding: 2px 5px; background: #f2f3f4; } .historic_date { font-weight: bold; } .charta { border: 9px double #FFD700; background: #FFFBE8; padding: 18px; } .charta p { text-align: justify; text-indent: 20px; } .address_list th { text-align: left; } .address_list th.address_department { padding: 2px; background: #f2f3f4; } .address_list td { font-size: 10px; padding: 1px 5px 1px 5px; border-bottom: 1px solid #d2d4d6; border-right: 1px solid #d2d4d6; } .address_list .contact_last td { border-bottom: none; } .address_list td:last-child { padding: 1px 0 1px 5px; border-right: none; } .address_list td:first-child { padding: 1px 5px 1px 0; } .address_list td.contact_number { white-space: nowrap; } .address_list td.contact_email { white-space: nowrap; } .touren li { list-style: none; font-weight: bold; } .touren li ul li { list-style: circle; font-weight: normal; } ul.sEleven_navi { margin: 0; } ul.sTen_navi { margin: 0; } #tab_container_inner { display: block !important; } .sTen_header div { line-height: 14px !important; } .sEleven_header div { height: 48px !important; line-height: 14px !important; } .sTen_image_container { padding: 3px !important; height: auto !important; } .sTen_image_container:after { display: block; content: ""; clear: both; } .sTen_image_frame { background: #ffffff; padding: 3px !important; border: 3px solid #e0e0e0; height: auto !important; } .sTen_image { height: auto !important; padding: 50%; } .sTen_image_container_large { height: auto !important; padding: 3px !important; } .sTen_image_frame_large { background: #ffffff; padding: 3px !important; border: 3px solid #e0e0e0; height: auto !important; } .sTen_image_large { padding: 24%; } .sEleven_image_container { padding: 3px !important; height: auto !important; } .sEleven_image_container:after { display: block; content: ""; clear: both; } .sEleven_image_frame { background: #ffffff; padding: 3px !important; border: 3px solid #e0e0e0; height: auto !important; } .sEleven_image { height: auto !important; padding: 50%; } /*-----| SIDE Navigation |--------------------------------------------------------------------------------------------------------------*/ nav#side_navi, nav#side_navi * { box-sizing: border-box; } nav#side_navi { position: fixed; z-index: 25; right: 0; top: 247px; width: 40px; } nav#side_navi ul { margin: 0 0 20px 0; background: rgba(0,146,207,1); border-radius: 10px 0 0 10px; } nav#side_navi ul li { position: relative; list-style: none; } nav#side_navi ul li a { display: block; height: 44px; background-repeat: no-repeat; background-position: center; background-color: rgba(0,0,0,0.5); } nav#side_navi ul li:hover a { background-color: #e04444; } nav#side_navi ul li:first-child a { border-top-left-radius: 10px; } nav#side_navi ul li:last-child a { border-bottom-left-radius: 10px; } nav#side_navi ul ul { display: none; position: absolute; right: 40px; top: 0; padding: 5px; background: rgba(255,144,0,1); border-radius: 10px 0 10px 10px; } nav#side_navi ul li:hover ul { display: block; } nav#side_navi ul ul li a { white-space: nowrap; color: #ffffff; height: auto; padding: 5px; cursor: pointer; } nav#side_navi ul ul li a:hover { background: rgba(0,0,0,1); } nav#side_navi ul ul li:first-child a { border-radius: 6px 6px 0 0; } nav#side_navi ul ul li:last-child a { border-radius: 0 0 6px 6px; } nav#side_navi #snBasket { position: relative; background-image: url('/pages2015/img/sn_basket.png'); } nav#side_navi #snBasket span { display: none; } nav#side_navi #snBasket.full { background-color: rgba(255,144,0,1); } nav#side_navi #snBasket.full span { display: block; position: absolute; left: -8px; bottom: -8px; width: 24px; height: 24px; background: rgba(228,5,22,1); border-radius: 12px; color: rgba(255,255,255,1); text-align: center; line-height: 22px; } nav#side_navi #snLogin { background-image: url('/pages2015/img/login.png'); } nav#side_navi #snMyShop { background-image: url('/pages2015/img/sn_user.png'); } nav#side_navi #snFav { background-image: url('/pages2015/img/sn_fav.png'); } nav#side_navi #snLogout { background-image: url('/pages2015/img/sn_logout.png'); } nav#side_navi #snExport { background-image: url('/pages2015/img/sn_export.png'); } nav#side_navi #snPrint { background-image: url('/pages2015/img/sn_print.png'); } nav#side_navi #snRecomment { background-image: url('/pages2015/img/sn_mail.png'); } nav#side_navi #snForum { background-image: url('/pages2015/img/sn_forum.png'); } #shadow, #shadow * { box-sizing: border-box; } #shadow { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vH; background: rgba(0,0,0,0.7); z-index: 1000000; } #shadow_container { position: relative; width: 550px; max-height: 86vH; margin: 7vH auto; padding: 3vH; border-radius: 10px; background: rgba(255,255,255,1); } #shadow_box { max-height: 80vH; overflow: auto; } #shadow_close { position: absolute; right: -15px; top: -15px; width: 30px; height: 30px; background: url(/pages2015/img/close_16.png) no-repeat center #ffffff; border-radius: 100%; border: 1px solid #dddddd; cursor: pointer; } #shadow_close:hover { background: url(/pages2015/img/close_16.png) no-repeat center #dddddd; } #shadow_container .login_container input { margin: 0 0 10px 0; } #shadow_container td { white-space: nowrap; } #shadow_container td:nth-child(2) { width: 100%; } .noPadding td { padding: 0 !important; } .noPadding td:first-child { padding: 0 5px 0 0 !important; } .img_cms { margin: 0 10px 10px 0; line-height: 1px; } .ui-icon, .ui-widget-content .ui-icon { background-image: url("/pages2015/jquery/jquery-ui-1.11.4/images/ui-icons_222222_256x240.png") !important; } .ui-accordion-header.ui-state-default { border: 1px solid #cccccc; background: #f2f3f4; color: #222222; } .ui-accordion-header.ui-state-active { border: 1px solid #cccccc; background: #ffffff; color: #222222; } #accordion .ui-accordion-header:hover { background: #a5a5a5; } .ui-widget-content { border: 1px solid #cccccc; background: #ffffff; color: #222222; } #tabs .ui-tabs-nav { background: linear-gradient(to bottom, #ffffff 0%,#ffffff 62%,#eeeeee 100%); } .locations2019 h2 { padding: 10px 20px; background: #f2f3f4; } .locations2019 .flex_box_25 { line-height: 1px; } .locations2019 .flex_box_50 { padding: 10px 20px; } .locations2019 .map { position: relative; min-height: 120px; } .locations2019 .map > div { position: absolute; left: 0; top: 0; right: 0; bottom: 0; } .locations2019 .map > div > iframe { width: 100%; height: 100%; border: none; } @media screen and (min-width: 769px) and (max-width: 959px) { .locations2019 .flex_box { width: 50% !important; } .locations2019 .flex_box_100 { background: #f2f3f4 } .locations2019 .flex_box_50 { padding: 20px 20px 20px 0; } .locations2019 .map { padding: 16.666%; } } @media screen and (max-width: 768px) { .locations2019 .flex_box { width: 100% !important; } .locations2019 .flex_box_50 { padding: 20px 0; } .locations2019 .map { padding: 33.3333%; } } .threecol2019 { margin: -30px -30px 0 -30px; } .threecol2019 .flex_container { padding: 0 15px; } .threecol2019 .flex_box { padding: 0 15px; } .threecol2019 h2 { padding: 10px 20px; background: #f2f3f4; } .threecol2019 table { width: 100%; } .threecol2019 .subtitle { padding: 10px 0; } .threecol2019 table td:first-of-type { white-space: nowrap; padding-right: 15px; } .threecol2019 table td:last-of-type { width: 100%; } @media screen and (max-width: 959px) { .threecol2019 .flex_box { width: 100% !important; padding-bottom: 30px; } } .toast-container { z-index: 99999999 !important; } table.auto_responsive { width: 100% !important; height: auto !important; } table.auto_responsive td, table.auto_responsive th { padding: 5px 10px !important; } table.auto_responsive tbody tr:nth-of-type(2N-1) td { background: #eeeeee; } table.auto_responsive thead tr td, table.auto_responsive thead tr th { background: #cccccc; text-align: left; } @media screen and (max-width: 959px) { table.auto_responsive thead { display: none; } table.auto_responsive, table.auto_responsive tbody, table.auto_responsive tbody tr, table.auto_responsive tbody tr td { display: block; background: none !important; } table.auto_responsive tbody tr { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 3px solid #cccccc; } table.auto_responsive tbody tr:last-of-type { padding-bottom: 0; margin-bottom: 0; border-bottom: none; } } .ui-dialog .ui-widget-header { background: #0076ad !important; } .ui-dialog { z-index: 10001; } .ui-widget-overlay { z-index: 10000; } @media screen and (max-width: 767px) { .myshop_responsive > table, .myshop_responsive > table > tbody, .myshop_responsive > table > tbody > tr, .myshop_responsive > table > tbody > tr > td { display: block; width: 100%; padding: 0 !important; } .myshop_responsive > table > tbody > tr > td.myMember_input { display: flex; padding: 0 0 10px 0 !important; } .myshop_responsive > table > tbody > tr > td.myMember_input > * { flex-grow: 1; } .myshop_responsive > table > tbody > tr > td.myMember_input > .wide { flex-grow: 6; } .myshop_responsive > table > tbody > tr > td.myMember_input > .wide.mr { margin-right: 5px; } .myshop_responsive > table > tbody > tr > td.myMember_input > .wide.ml { margin-left: 5px; } .myshop_responsive > table > tbody > tr > td.myMember_input.radios { display: block } .myshop_responsive > table > tbody > tr > td.myMember_input.radios:after { display: block; content: ""; clear: both; } .myshop_responsive > table > tbody > tr > td.myMember_input.radios > input { float: left; flex-grow: 0; margin: 5px 5px 0 0; clear: both; } .myshop_responsive > table > tbody > tr > td.myMember_input.radios > label { float: left; min-width: 80%; } }